<template>
    <el-select
        v-model="form[formId]"
        :multiple="multiple"
        collapse-tags
        @change="selectAll"
        :placeholder="$t('m.placeholder.selectBrand')"
        filterable
        clearable
        :size="size"
    >
        <allAddDelSelect
            v-if="multiple"
            :selectForm="form"
            :selectArray="brand"
            :selectFormId="formId"
            selectArrayId="productBrandId"
            :size="addSize"
            @selectAll="selectAll"
            @selectDel="selectDel"
        ></allAddDelSelect>
        <el-option
            v-for="item in brand"
            :key="item.productBrandId"
            :label="item.productBrand"
            :value="item.productBrandId"
        ></el-option>
    </el-select>
</template>
<script>
const ERR_OK = 200;
export default {
    props: {
        form: Object,
        addSize: String,
        size: String,
        formId: String,
        formBU: String,
        multiple: Boolean 
    },
    data() {
        return {
            brand: []
        };
    },
    created() {
        this.getBrand();
    },
    methods: {
        getBrand(boolean) {
            //字符串转数组
            let productBrandId = boolean
                ? this.form[this.formId] instanceof Array
                    ? this.form[this.formId]
                    : Array(this.form[this.formId].toString())
                : [];
            if (boolean && productBrandId.length <= 0) {
                return;
            }
            this.$ajax({
                method: "post",
                url:
                    
                    this.GLOBAL.commonService +
                    "/query/productBrandQuery",
                data: {
                    businessUnitIds: this.stringToArray(boolean, this.formBU),
                    productBrandIds: productBrandId
                }
            }).then(res => {
                if (res.data.code === ERR_OK) {
                    if (boolean) {
                        //倒选
                        this.form[this.formBU] = res.data.data.BusinessUnit.map(
                            item => item.businessUnitId
                        );
                    } else {
                        this.brand = res.data.data.ProductBrand;
                        //判断是否多选
                        if (this.form[this.formId] instanceof Array) {
                            this.form[this.formId] = this.form[
                                this.formId
                            ].filter(
                                item =>
                                    !this.brand.every(
                                        ele => ele.productBrandId !== item
                                    )
                            );
                        } else {
                            this.form[this.formId] = this.brand.find(
                                item =>
                                    item.productBrandId ==
                                    this.form[this.formId]
                            )
                                ? this.form[this.formId]
                                : "";
                        }
                    }
                }
            });
        },
        stringToArray(boolean, id) {
            return boolean
                ? []
                : this.form[id] instanceof Array
                ? this.form[id]
                : this.form[id]
                ? Array(this.form[id].toString())
                : [];
        },
        selectAll() {
            this.$emit("selectAll", this.Brand);
        },
        selectDel() {
            this.$emit("selectDel", this.Brand);
        }
    },
    components: {
        allAddDelSelect: resolve =>
            require(["components/searchfor/allAddDelSelect.vue"], resolve)
    }
};
</script>